<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=<device-width>, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="demo.css">

    <style>
        /* 标签选择器 */
        p {
            color: rgb(0, 106, 255);
        }

        div {
            color: red;
        }

        span {
            color: deepskyblue;
        }

        /* 类选择器 */
        .red {
            color: red;
        }

        .blue {
            color: blue;
        }

        .front20 {
            font-size: 20px;
        }

        /* id选择器 */
        #div1 {
            font-size: 25px;
        }

        /* 通配符选择器 */
        * {
            color: #ff0000;
            font-weight: 900;
            font: bold 40px "Fira Sans", sans-serif
        }
    </style>

</head>

<body>
    <p style="color:aquamarine" class="red">一个段落</p>
    <div class="red front20" id="div1">我是一个div1</div>
    <div class="red front20">我是一个div2</div>
    <a href="#" class="front20">超链接1</a>
    <a href="#">超链接2</a>
    <a href="#">超链接3</a>
    <div>
        <span class="blue">span1</span>
        <span>span2</span>
        <span>span3</span>
    </div>
    <div>我是一个div3</div>
</body>

</html>